<template>
	<view class="page">
		<up-tabs :list="tab2list" @click="tabHandle2" :bgBottom="22" lineWidth="28" lineHeight="9" :activeStyle="{
			color: '#3333331',
			fontWeight: 'bold',
			transform: 'scale(1.02)'
		}" :inactiveStyle="{
			color: '#333333',
			transform: 'scale(1)'
		}" :lineColor="`url(${lineBg}) 100% 100%`"
		></up-tabs>
		<up-list @scrolltolower="scrolltolower">
			<view class="list">
				<up-list-item v-for="(item, index) in indexList" :key="index">
					<view class="item s-flex-r-s-c" @click="go(`/pages/zixun/details?id=${item.id}&title=${item.name}`)">
						<image class="img" :src="item.image" mode=""></image>
						<view class="r-c s-flex-c-b-s">
							<view class="tit">
								{{item.name}}
							</view>
							<view class="time">
								{{item.createtime}}
							</view>
						</view>
					</view>
				</up-list-item>
			</view>
		</up-list>
	</view>
</template>

<script setup>
	import {ref,getCurrentInstance } from "vue"
	const { proxy } = getCurrentInstance()
	const lineBg =
		''
	const tab2list = ref([])
	const tab2 = ref(0)
	const params = ref({
		page:1,
		per_page:10
	})
	const indexList = ref([])
	function getTabData() {
		proxy.$request({
			url: 'api/consult/consultSort',
			header:"application/x-www-form-urlencoded",
			data: {}
		}).then(res => {
			if (res.code == 0) {
				return proxy.$toast(res.msg)
			} else {
				tab2list.value = res.data.list
				tab2.value=tab2list.value[0].id
				getListData()
			}
		})
	}
	getTabData()
	function getListData() {
		proxy.$request({
			url: 'api/consult/consultManage',
			header:"application/x-www-form-urlencoded",
			data: {
				consult_sort_id:tab2.value,
				page:params.value.page,
				per_page:params.value.per_page,
			}
		}).then(res => {
			if (res.code == 0) {
				return proxy.$toast(res.msg)
			} else {
				indexList.value = res.data.list
			}
		})
	}
	function tabHandle2(i) {
		tab2.value = i.id
		getListData()
	}
	const onLoad = () => {
	  loadmore();
	};
	
	const scrolltolower = () => {
	  loadmore();
	};
	
	const loadmore = () => {
	};
</script>

<style lang="scss" scoped>
	.list{
		padding: 30rpx 32rpx;
		box-sizing: border-box;
	}
	.item{
		margin-bottom: 32rpx;
		box-sizing: border-box;
		.img{
			margin-right: 20rpx;
			width: 160rpx;
			height: 160rpx;
			border-radius: 8rpx 8rpx 8rpx 8rpx;
		}
		.r-c{
			flex: 1;
			height: 160rpx;
			.tit{
				font-weight: 600;
				font-size: 32rpx;
				color: #333333;
				line-height: 48rpx;
			}
			.time{
				font-weight: 400;
				font-size: 24rpx;
				color: #999999;
				line-height: 48rpx;
			}
		}
	}
</style>